.home {
    font-size: 20px;
  
    // 头部样式
    .head-tab--nav {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      font-size: 14px;
      padding: 0 20px;
      color: #b7b7b7;
      background-color: #fff;
      border-bottom: 1px solid #e5e6e6;
      height: 50px;
  
      .head-nav {
        width: 100%;
        padding: 0px;
  
        .c-normal {
          display: inline-block;
          color: #333;
          margin-left: 5px;
          font-size: 18px;
          padding-left: 10px;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          border-left: 2px solid #20a8d8;
        }
      }
    }
  
    .home-container {
      padding: 10px 10px 0 10px;
  
      .leftBox {
        width: 70%;
        padding: 0 5px 0 0;
      }
  
      .rightBox {
        width: 30%;
        padding: 0 0 0 5px;
      }
  
      .dt-box {
        margin-bottom: 10px;
        padding: 20px;
        background-color: #fff;
        border: 1px solid #e5e6e6;
        min-height: 173px;
      }
  
      .top-title-model {
        >span {
          display: inline-block;
          margin-right: 20px;
          padding-left: 10px;
          border-left: 2px solid #20a8d8;
        }
      }
  
      .dt-box-contain {
        padding-top: 15px;
      }
  
      .admissions-briefing {
        margin: 30px 0px 20px 0px;
        border-bottom: none;
        padding: 0px;
  
        .el-col {
          margin-bottom: 20px;
          // width: 20%;
  
          a {
            color: #333;
            text-align: center;
            font-size: 14px;
            cursor: pointer;
  
            .small-menu {
              width: 63px;
              color: #fff;
              font-size: 29px;
              padding: 15px 0px;
              border-radius: 50%;
              i{
                vertical-align: middle;
                text-align: center;
              }
              i:before{
                color: #fff;
              }
            }
  
            .menu1 {
              background: #27b2f3;
            }
  
            .menu2 {
              background: #13e991;
            }
  
            .menu3 {
              background: #ed471a;
            }
  
            .menu4 {
              background: #be10f0;
            }
  
            .menu5 {
              background: #5FBDFF;
            }
            .menu6 {
              background: #FD760A;
            }
  
            .menu-title {
              width: 63px;
              margin-top: 10px;
            }
          }
        }
      }
  
      // 员工通知
      .staff-message {
        padding-top: 5px;
        display: flex;
        align-items: center;
        cursor: pointer;
  
        .tit {
          width: 84px;
          padding: 6px 0;
          margin-right: 10px;
          text-align: center;
          font-size: 12px;
          color: #fff;
          background-color: #20A8D8;
          border-radius: 3px;
        }
  
        .conts_box {
          flex: 1;
          padding: 8px 0;
          display: flex;
          align-items: center;
          border-bottom: 1px dashed #ddd;
  
          .conts {
            flex: 1;
            padding-right: 10px;
            display: flex;
            word-break: break-all;
            color: #666;
            font-size: 14px;
  
            text-overflow: -o-ellipsis-lastline;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            -webkit-box-orient: vertical;
          }
  
          .time {
            color: #aaa;
            font-size: 12px;
          }
        }
      }
      // .staff-message {
      //   font-size: 14px;
      //   color: #666666;
  
      //   .el-row {
      //     margin-bottom: 10px;
      //     cursor: pointer;
      //   }
  
      //   .status-span {
      //     width: 10px;
      //     height: 10px;
      //     display: inline-block;
      //     margin-top: 2px;
      //     margin-right: 5px;
      //     background: #ed471a;
      //     border-radius: 50%;
      //   }
  
      //   .title-span {
      //     display: inline-block;
      //     margin-right: 5px;
      //   }
      // }
  
      // 系统升级
      .stystem-message {
        text-align: center;
        color: #aaaaaa;
  
        >p {
          margin-bottom: 60px;
        }
  
        img {
          display: block;
          margin: 10px auto 10px auto;
        }
      }
  
      .el-button--medium.is-round {
        padding: 3px 10px;
        font-size: 12px;
        border-radius: 10px;
      }
  
  
      //样式适配
  
      @media (max-width: 1500px) {
        .leftBox {
          width: 65%;
        }
  
        .rightBox {
          width: 35%;
        }
      }
  
      @media (max-width: 1300px) {
        .leftBox {
          width: 60%;
        }
  
        .rightBox {
          width: 40%;
        }
      }
    }
  
    .el-main {
      background: #E1E7EE;
    }
  
    #page-home {
      background: #E1E7EE;
    }
  
    .top-title-model {
      position: relative;
    }
  
    .button-fiter:nth-of-type(3)+.el-range-editor--medium.el-input__inner {
      width: 60px;
      position: absolute;
      height: 18px;
      cursor: pointer;
      font-size: 12px !important;
      top: 4px;
      left: 195px;
      opacity: 0;
    }
  
    // 详细消息
    .slider {
      .el-icon-close{
        cursor: pointer;
      }
      .right-slider-box {
        .slider-header {
          padding: 0px 20px;
          border-bottom: 1px solid #ccc;
          text-align: center;
          height: 50px;
          line-height: 50px;
  
          span {
            font-weight: 500;
          }
  
          i {
            // font-size: 28px;
            display: inline-block;
          }
        }
  
        .slider-cont {
          padding: 20px 20px;
  
          .info-title {
            text-align: center;
            font-weight: 500;
            margin-bottom: 5px;
          }
  
          >p {
            line-height: 26px;
          }
  
          .info-small-title {
            text-align: center;
          }
  
          .text-content {
            letter-spacing: 3px;
          }
  
          .info-img {
            width: 100%;
            border-radius: 6px;
            margin: 20px auto;
  
            img {
              width: 100%;
            }
          }
        }
      }
    }
  
  
    // 统计信息
    .dt-box2{
      margin-bottom: 10px;
      padding: 20px;
      background-color: #fff;
      border: 1px solid #e5e6e6;
      min-height: 173px;
      .statistic-mess{
        display: flex;
        align-items: center;
        justify-content: space-between;
        .daohang{
          color: #AAAAAA;
          font-size: 14px;
          display: flex;
          align-items: center;
          .active{
            font-size: 16px;
            color: #333333;
          }
          p{
            padding: 0 10px;
            cursor: pointer;
            &:nth-of-type(1){
              border-right: 1px solid #AAAAAA;
            }
          }
        }
      }
      .dt2-list{
        margin-top: 20px;
        display: flex;
        align-items: center;
        li{
          flex: 1;
          display: flex;
          flex-flow: column nowrap;
          align-items: center;
          .small-menu {
            width: 44px;
            color: #fff;
            font-size: 23px;
            padding: 8.5px 0px;
            border-radius: 50%;
            text-align: center;
            i{
              vertical-align: middle;
              text-align: center;
            }
            i:before{
              color: #fff;
            }
          }
          p{
            font-size: 14px;
            margin-top: 3px;
          }
          .number{
            color: #0A9EE8;
          }
          .menu1 {
            background: #27b2f3;
          }
          .menu2 {
            background: #0ABBD3;
          }
          .menu3 {
            background: #4DAF50;
          }
          .menu4 {
            background: #8F23AB;
          }
          .menu5 {
            background: #3A49AB;
          }
          .menu6 {
            background: #F16191;
          }
          .menu7 {
            background: #BA68C7;
          }
          .menu8 {
            background: #7F57C1;
          }
        }
      }
    }
    .qiehuan{
      .statistic-mess{
        display: flex;
        align-items: center;
        justify-content: space-between;
        .daohang{
          color: #AAAAAA;
          font-size: 14px;
          display: flex;
          align-items: center;
          .active{
            font-size: 16px;
            color: #333333;
          }
          p{
            padding: 0 10px;
            cursor: pointer;
            &:nth-of-type(1){
              border-right: 1px solid #AAAAAA;
            }
            &:nth-of-type(2){
              border-right: 1px solid #AAAAAA;
            }
          }
        }
      }
    }
  
    .silder-contain .slider-top {
      border-bottom: none;
      line-height: 50px;
      padding: 0px 20px;
      border-bottom: 1px solid #ddd;
      .co-info {
        font-size: 16px;
        display: inline-block;
        margin-right: 10px;
      }
    
      .edit-pass {
        display: inline-block;
        margin-left: 10px;
        cursor: pointer;
      }
    }
    .silder-contain .slider-cont {
      padding: 0px 20px;
      .form-small-title{
        padding-left: 10px;
        border-left: 2px solid #20a8d8;
      }
      .message-title,
      .myinfo {
        background: #e9eff4;
        height: 35px;
        line-height: 35px;
        padding: 0px 20px;
      }
    
      .row-message {
        padding: 10px 20px;
        border-bottom: 1px solid #ddd;
        cursor: pointer;
    
        .message-cont {
          line-height: 24px;
    
          span {
            display: inline-block;
            margin-right: 10px;
          }
    
          span+span {
            color: #20a8d8;
            cursor: pointer;
          }
        }
      }
    
      .span-message {
        display: inline-block;
        background: #20a8d8;
        color: #fff;
        margin-bottom: 5px;
        padding: 2px 5px;
        border-radius: 3px;
        font-size: 12px;
        position: relative;
    
        .read {
          width: 10px;
          height: 10px;
          background: rgba(255, 0, 0, 1);
          border: 1px solid rgba(255, 255, 255, 1);
          border-radius: 50%;
          position: absolute;
          right: -5px;
          top: -4px;
        }
      }
    
      .sapn-message-no::after {
        // width: 60px;
        // height: 10px;
        // display: inline-block;
        // margin-top: 2px;
        // position: absolute;
        // right: 0px;
        // margin-right: 5px;
        // background: #ed471a;
        // border-radius: 50%;
      }
    
      .sapn-warning {
        background: #f8cb00;
      }
    }
  
    .caution-message{
      li{
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #333;
        font-size: 14px;
        border: 1px solid #ddd;
        border-radius: 5px; 
        padding: 10px;
        margin-top: 15px;
        cursor: pointer;
        .cam-left{
          display: flex;
          align-items: center;
          i{
            font-size: 20px;
          }
          span{
            margin-left: 10px;
          }
        }
        &:nth-of-type(5){
          .cam-left{
            i{
              font-size: 16px;
            }
          }
        }
        .cam-right{
          i{
            margin-left: 10px;
          }
        }
      }
    }
  }